<template>
  <storeDiy ref="storeDiyRef" tools-type="user" @save="saveClick"></storeDiy>
</template>
    <script lang="ts" setup>
import { ref, getCurrentInstance, onMounted } from "vue";
import storeDiy from "@/components/diy/index.vue";
import { Result, ResultError } from "@/types";

import { getDiyUser,updateDiyUser } from "@/api/store/diy_page";

const {
  proxy,
  proxy: { $utils },
} = getCurrentInstance() as any;

const storeDiyRef = ref<HTMLElement>();

const toInit = () => {
  getDiyUser()
    .then((res: Result) => {
      proxy?.$refs["storeDiyRef"]?.refreshDiyData(false, res.data);
    })
    .catch((err: ResultError) => {
      $utils.errorMsg(err);
    });
};

const saveClick = (diyData: any) => {
  updateDiyUser({
    diy_user: diyData,
  })
    .then((res: Result) => {
      $utils.successMsg(res.message);
      toInit();
      setTimeout(() => {
        proxy?.$refs["storeDiyRef"]?.resetBtn();
      }, 1000);
    })
    .catch((err: ResultError) => {
      $utils.errorMsg(err);
      proxy?.$refs["storeDiyRef"]?.resetBtn();
    });
};
onMounted(() => {
  toInit();
});
</script>